/*
 * @Autor: dc
 * @Date: 2022-03-29 16:51:54
 * @LastEditors: dc
 * @LastEditTime: 2022-03-30 15:43:19
 * @Description: UI组件
 */


import React, { Component } from 'react';

class index extends Component {
    state = { count: 0 }


    // 加
    increment = () => {
        const { value } = this.selectNumber;
        this.props.jia(value);
    }
    // 减
    decrement = () => {
        const { value } = this.selectNumber;
        this.props.jian(value);
    }
    // 奇数加
    incrementIfOdd = () => {
        const { value } = this.selectNumber;
        if(this.props.count % 2 === 0) return false;
        this.props.jia(value);
    }
    // 异步加
    incrementAsync = () => {
        const { value } = this.selectNumber;
        this.props.jiaAsync(value,500)
    }
    render() {
        console.log(this.props)
        const {count} = this.props
        return (
            <div>
                <h1>当前和为：{count}</h1>
                <select ref={c => this.selectNumber = c}>
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                </select>
                <button onClick={this.increment}>+</button>
                <button onClick={this.decrement}>-</button>
                <button onClick={this.incrementIfOdd}>当前求和为奇数再加</button>
                <button onClick={this.incrementAsync}>异步加</button>

            </div>
        );
    }
}

export default index;